<template>
	<!-- vue3支持多个根组件 -->
	<view class="content">
		<!-- 轮播图组件 -->
		<TUI_Swiper :config="swiperConfig" @enentone="getWeight" />
		<button type="default" @click="goToMyInfo">调到个人中心</button>
	</view>
</template>

<script setup>
	 // 页面除支持 Vue 组件生命周期外还支持下方页面生命周期函数
	import { ref,reactive,onMounted } from 'vue';
	import {onLoad,onReady,onShow,onHide} from "@dcloudio/uni-app";
	//引入用户相关的小仓库
	import useUserStore from '@/store/user.js'
	import { requestIndexSwiper } from '@/utils/api.js'
	const useuserstore = useUserStore()
	
	const swiperConfig = reactive({
		swiperList:[],   //swiper列表数据
		autoplay:true,
		indicatorDots:false,
		duration:5000
	})
	async function getIndexSwiper(){
		const params = {
			imageType:"indexSwiper",
			imageStatus:"1"
		}
		const result = await requestIndexSwiper(params);
		swiperConfig.swiperList =  result.data.list
			
	}
	const getWeight = (res)=>{
		console.log("看看子组件传递过来的参数",res)
	}
// 获取首页轮播图  相当于created 
// 我在hotfix分支上面写功能   ....三个小时候写完了
	onLoad(()=>{
		console.log("页面onLoad")
		getIndexSwiper()
	})

	onHide(()=>{
		console.log('页面隐藏onHide')
	})

	onShow(()=>{
		console.log('页面onShow')
	})
	onReady(()=>{
		console.log('页面onReady')
	})

	onMounted(()=>{
		console.log('页面onMounted')
	})
	
	// 跳转的方法
	const goToMyInfo = function(){
		// 保留当前页面，跳转到应用内的某个页面
		uni.navigateTo({
			url:"/pages/myInfo/myInfo?name='suming'&age=35",
			events: {
			    // // 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
			    // acceptDataFromOpenedPage: function(data) {
			    //   console.log("我是index页面",data)
			    // },
			    // someEvent: function(data) {
			    //   console.log("我是index页面",data)
			    // }
			  },
			  success: function(res) {
			    // 通过eventChannel向被打开页面传送数据
			    res.eventChannel.emit('sendTosuccessData', { data: 'data from starter page' })
			  }
		})
	}
	// 我在这里完成了login功能.里面有个bug 我现在看不到
	
</script>

<style>
/* 	.searchDom{
		width: 400rpx !important;
		height: 50rpx !important;
	} */
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>
